import React, { useState } from 'react';
import { User } from '../App';
import { Sidebar, SidebarContent, SidebarProvider } from './ui/sidebar';
import { NavigationSidebar } from './NavigationSidebar';
import { TopHeader } from './TopHeader';
import { StudentDashboard } from './dashboard/StudentDashboard';
import { TeacherDashboard } from './dashboard/TeacherDashboard';
import { AdminDashboard } from './dashboard/AdminDashboard';
import { CourseSelection } from './student/CourseSelection';
import { GradeQuery } from './student/GradeQuery';
import { AttendanceRecord } from './student/AttendanceRecord';
import { CourseManagement } from './teacher/CourseManagement';
import { GradeManagement } from './teacher/GradeManagement';
import { AttendanceManagement } from './teacher/AttendanceManagement';
import { UserManagement } from './admin/UserManagement';
import { CourseSystemConfig } from './admin/CourseSystemConfig';
import { SystemStatistics } from './admin/SystemStatistics';

interface MainLayoutProps {
  user: User;
  onLogout: () => void;
}

export function MainLayout({ user, onLogout }: MainLayoutProps) {
  const [activeView, setActiveView] = useState('dashboard');

  const renderContent = () => {
    if (user.role === 'student') {
      switch (activeView) {
        case 'course-selection':
          return <CourseSelection />;
        case 'grade-query':
          return <GradeQuery />;
        case 'attendance-record':
          return <AttendanceRecord />;
        default:
          return <StudentDashboard />;
      }
    } else if (user.role === 'teacher') {
      switch (activeView) {
        case 'course-management':
          return <CourseManagement />;
        case 'grade-management':
          return <GradeManagement />;
        case 'attendance-management':
          return <AttendanceManagement />;
        default:
          return <TeacherDashboard />;
      }
    } else {
      switch (activeView) {
        case 'user-management':
          return <UserManagement />;
        case 'course-system':
          return <CourseSystemConfig />;
        case 'statistics':
          return <SystemStatistics />;
        default:
          return <AdminDashboard />;
      }
    }
  };

  return (
    <SidebarProvider>
      <div className="flex h-screen w-full">
        <Sidebar className="w-64 border-r">
          <SidebarContent>
            <NavigationSidebar 
              user={user} 
              activeView={activeView} 
              onViewChange={setActiveView} 
              onLogout={onLogout}
            />
          </SidebarContent>
        </Sidebar>
        
        <div className="flex-1 flex flex-col">
          <TopHeader user={user} onLogout={onLogout} />
          
          <main className="flex-1 overflow-auto p-6 bg-gray-50">
            {renderContent()}
          </main>
        </div>
      </div>
    </SidebarProvider>
  );
}